import React, { Component } from 'react';
import {HashRouter,Route,Switch} from 'react-router-dom';
import App from './App';
import Buttons from './pages/ui/buttons';
import Modals from './pages/ui/modals';
import Loadings from './pages/ui/loadings';
import Notice from './pages/ui/notice';
import Message from './pages/ui/messages';
import Tabs from './pages/ui/tabs';
import FormLogin from './pages/form/login';
import FormRegister from './pages/form/register';
import BasicTable from './pages/table/basicTable';
import City from './pages/city/index';
import Order from './pages/order/index';
import Login from './pages/login';
import Admin from './admin';
import NotFound from './pages/NotFound';
import Common from './common'
import OrderDetail from './pages/order/detail'

export default class Router extends Component {
    render() {
        return (
            <div>
               <HashRouter>
                    <App>
                        <Switch>
                            <Route path="/login" component={Login}/>
                            <Route path="/admin" render={()=>
                                <Admin>
                                    <Switch>
                                        <Route exact={true} path="/admin/ui/buttons" component={Buttons}/>
                                        <Route exact={true} path="/admin/ui/modals" component={Modals}/>
                                        <Route exact={true} path="/admin/ui/loadings" component={Loadings}/>
                                        <Route exact={true} path="/admin/ui/notification" component={Notice}/>
                                        <Route exact={true} path="/admin/ui/messages" component={Message}/>
                                        <Route exact={true} path="/admin/ui/tabs" component={Tabs}/>
                                        <Route exact={true} path="/admin/form/login" component={FormLogin}/>
                                        <Route exact={true} path="/admin/form/reg" component={FormRegister}/>
                                        <Route exact={true} path="/admin/table/basic" component={BasicTable}/>
                                        <Route exact={true} path="/admin/city" component={City}/>
                                        <Route exact={true} path="/admin/order" component={Order}/>

                                        {/* 404页面 */}
                                        <Route component={NotFound}/>
                                    </Switch>
                                </Admin>
                            }>
                            </Route>

                            <Route path="/common" render={()=>
                                <Common>
                                    <Route path="/common/order/detail/:orderId" component={OrderDetail}/>
                                </Common>
                            }>
                            </Route>
                        </Switch>
                    </App>
               </HashRouter> 
            </div>
        )
    }
}
